<template>
  <div class="tabbar-container">
    <van-tabbar active-color="#FF6037" inactive-color="#333" route>
      <van-tabbar-item to="/home" icon="shouye1" icon-prefix="icon">首页</van-tabbar-item>
      <van-tabbar-item to="/cate" icon="fenlei" icon-prefix="icon">分类</van-tabbar-item>
      <van-tabbar-item
        to="/cart"
        icon="gouwuche"
        :badge="cartStore.number"
        icon-prefix="icon"
        >购物车</van-tabbar-item
      >
      <van-tabbar-item to="/user" icon="wode" icon-prefix="icon">我的</van-tabbar-item>
    </van-tabbar>
  </div>
</template>

<script setup lang="ts">
import { onMounted } from "vue";
import useCartStore from "@/stores/cart";
const cartStore = useCartStore();

// onMounted(() => {
//   cartStore.getCartInfo();
// });
</script>

<style scoped lang="scss">
.tabbar-container :deep .icon {
  font-size: 22px;
}
</style>
